<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->

        <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="css/style.css"> <!-- slider -->
        <!--<script src="js/vendor/modernizr-2.6.2.min.js"></script> -->       
        <!--<script type="text/javascript" src="js/jquery.js"></script>  menu -->
        <!--<script type="text/javascript" src="js/menu.js"></script>   menu -->
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <!-- jquery library (slider e fancyBox) -->
        <script src="js/jquery.glide.js"></script> <!-- slider -->        
    </head>
    <body id="interna">
        <!--[if lt IE 7]>
            <p class="browsehappy">Você está usando um browser <strong>ultrapassado</strong>. Por favor <a href="http://browsehappy.com/">atualize seu browser</a> para melhorar sua navegação.</p>
        <![endif]-->

        <header>
            <div id="topo" class="container">
                <a href="#"><img class="logo" src="img/logo.png" /></a>
                <div id="menu-ajuda">
                    <a class="fancybox fancybox.iframe" href="busca.html"><div id="busca-p"></div></a>
                    <div id="busca">
                        <form>
                            <span>
                                <input class="buscar-txt" type="search" name="s" placeholder="O que você procura?">
                                <input class="buscar-btn" type="submit" value="">
                            </span>
                        </form>
                    </div>

                    <div id="contato-duvidas">
                        <a href="#">
                            <div id="contato">
                                <span><img src="img/contato.png" alt="fale conosco"> fale conosco</span>
                            </div>
                        </a>
                        <a href="#">
                            <div id="duvidas">
                                <span><img src="img/duvidas.png" alt="dúvidas e sugestões" /> dúvidas e sugestões</span>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
            <div id="banner-container">
                <div class="banner slider">
                    <ul class="slides">
                        <li class="slide"><a href="#"><span class="banner-title">Bem-vindo à sua enciclopédia online sobre a Amazônia</span><img src="img/penas-arara.jpg"/></a></li>
                        <li class="slide"><a href="#"><span class="banner-title">This is a slide.</span><img src="http://placekitten.com/1280/420"/></a></li>
                        <li class="slide"><a href="#"><span class="banner-title">This is a slide.</span><img src="http://placekitten.com/1280/420"/></a></li>
                    </ul>
                </div>
            </div>
        </header>

        <div id="menu-mobile">
            <p class="categoria-title">filtrar por Categoria:</p>
            <div class="select-estilo">
                <select>
                    <option>DESTAQUES</option>
                    <option>TODOS</option>
                    <option>Animais</option>
                    <option>Bibliotecas</option>
                    <option>Biodiversidade</option>
                    <option>Biografias</option>
                    <option>Cidades</option>
                    <option>Culinária</option>
                    <option>Cultura</option>
                    <option>Doenças Tropicais</option>
                    <option>Economia</option>
                    <option>Esportes da Amazônia</option>
                    <option>Estados</option>
                    <option>Folclore</option>
                    <option>Geografia</option>
                    <option>Hinos</option>
                    <option>Lendas</option>
                    <option>Lugares Históricos</option>
                    <option>Mapas e Bandeiras</option>
                    <option>Meio ambiente</option>
                    <option>Museus</option>
                    <option>Objetos</option>
                    <option>Países Amazônicos</option>
                    <option>Paques Nacionais</option>
                    <option>Peixes da Amazônia</option>
                    <option>Política</option>
                    <option>Reservas</option>
                    <option>Turismo</option>
                </select>
            </div>
        </div>

        <div id="superbanner" class="container"></div>

        <div class="container">

            <div id="menu">
                <nav>
                    <p class="categoria-title">filtrar por Categoria:</p>
                    <ul class="menu" id="nav">
                        <li><a href="#"><span class="current">DESTAQUES</span></a></li>
                        <li><a href="#"><span>Animais</span></a></li>
                        <li><a href="#"><span>Bibliotecas</span></a></li>
                        <li><a href="#"><span>Biodiversidade</span></a></li>
                        <li><a href="#"><span>Biografias</span></a></li>
                        <li><a href="#"><span>Cidades</span></a></li>
                        <li><a href="#"><span>Culinária</span></a></li>
                        <li><a href="#"><span>Cultura</span></a></li>
                        <li><a href="#"><span>Doenças Tropicais</span></a></li>
                        <li><a href="#"><span>Economia</span></a></li>
                        <li><a href="#"><span>Esportes da Amazônia</span></a></li>
                        <li><a href="#"><span>Estados</span></a></li>
                        <li><a href="#"><span>Folclore</span></a></li>
                        <li><a href="#"><span>Geografia</span></a></li>
                        <li><a href="#"><span>Hinos</span></a></li>
                        <li><a href="#"><span>Lendas</span></a></li>
                        <li><a href="#"><span>Lugares históricos</span></a></li>
                        <li><a href="#"><span>Mapas e Bandeiras</span></a></li>
                        <li><a href="#"><span>Meio ambiente</span></a></li>
                        <li><a href="#"><span>Museus</span></a></li>
                        <li><a href="#"><span>Objetos</span></a></li>
                        <li><a href="#"><span>Países Amazônicos***</span></a></li>
                        <li><a href="#"><span>Parques Nacionais</span></a></li>
                        <li><a href="#"><span>Peixes da Amazônia</span></a></li>
                        <li><a href="#"><span>Política***</span></a></li>
                        <li><a href="#"><span>Reservas</span></a></li>
                        <li class="last"><a href="#"><span>Turismo</span></a></li>
                    </ul>
                    <img class="grafismo-menu" src="img/grafismo-menu.png">
                </nav>
            </div>

            <div id="conteudo">

                <div id="pagina-padrao">
                    <h1 class="artigo-title">Resultado de Busca</h1>
                    <hr>
                    <div class="artigo-main">
                            <p>
                            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
                            </p>
                        </div>
                    </div>
                </div>

            </div>
        </div>

        <div id="publicidade" class="container"></div>

        <footer>
        </footer>

        <!--<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>-->
        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>
        <script>
            var glide = $('.slider').glide({
                    afterTransition: function() {
                        var currentSlide = this.currentSlide;
                        console.log(currentSlide);
                    }
                }).data('api_glide');

                $(window).on('keyup', function (key) {
                    if (key.keyCode === 13) {
                        glide.jump(3, console.log('Wooo!'));
                    };
                });

                $('.slider-arrow').on('click', function() {
                    console.log(glide.current());
                });
        </script>
    </body>
</html>
